/*
* Created by: yyf
* Description: 母基金管理--已退出母基金 列表页
*/
<template>
    <div>
        <div class="right">
            <el-row>
                <el-col :span="6" class="ca-title">
                    <h3>已退出母基金</h3>
                </el-col>
            </el-row>
            <el-form class="ca-box ca-list-title" label-width="125px" :model="param" :rules="rules">
                <el-row>
                    <el-col :span="6">
                        <el-form-item label="基金类型">
                            <el-select v-model="param.fundType" placeholder="请选择">
                                <el-option
                                    v-for="item in initView.fundType"
                                    :label="item.name"
                                    :key="item.id"
                                    :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="基金名称">
                            <el-input v-model="param.fundName" @keyup.native.13="getFundsList" class="ca-w-100" placeholder="支持模糊查询" :maxlength="100"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="7">
                        <el-form-item label="成立时间" label-width="125px">
                            <el-date-picker v-model="param.startTime" type="date" placeholder="选择开始日期" class="ca-w-100"></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1">
                        <span class="ca-align-center-self">至</span>
                    </el-col>
                    <el-col :span="4">
                        <el-form-item label-width="0">
                            <el-date-picker v-model="param.endTime" type="date" placeholder="选择结束日期" class="ca-w-100"></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="7">
                        <el-form-item label="基金规模(万元)" label-width="125px" prop="startScale">
                            <el-input v-model="param.startScale" :maxlength="17" class="ca-w-100"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="1">
                        <span class="ca-align-center-self">至</span>
                    </el-col>
                    <el-col :span="4">
                        <el-form-item label-width="0" prop="endScale">
                            <el-input v-model="param.endScale" :maxlength="17" class="ca-w-100"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" class="ca-pull-right ca-align-right">
                        <el-button type="primary" @click="getFundsList">查询</el-button>
                        <el-button type="primary" @click="downloadFile" :disabled="!isAuthListDownload">下载</el-button>
                    </el-col>
                </el-row>
            </el-form>
            <el-table class="ca-table" :data="fundData" @sort-change="sortChange">
                <el-table-column label="序号" type="index" width="70px" align="center">
                    <template slot-scope="scope">
                        <csRedDot :label="scope.$index+1+''" :showDot="scope.row.red==1?true:false" :type="1"></csRedDot>
                    </template>
                </el-table-column>
                <el-table-column
                    label="母基金名称"
                    prop="fundName">
                    <template slot-scope="scope">
                        <el-tooltip :content="scope.row.fundName" placement="top" class="item">
                            <el-button type="text"
                                       @click="toDetail(scope.row.id)"
                                       :disabled="!(isAuthDetailSee || isAuthPartnerSee || isAuthInvestmentSee || isAuthAnalysisSee || isAuthPaybackSee || isAuthDistributionSee || isAuthFileSee)"
                                       class="ca-underline ca-text-over-flow-ellipsis">
                                {{scope.row.fundName}}
                            </el-button>
                        </el-tooltip>
                    </template>
                </el-table-column>
                <el-table-column label="基金类型" prop="fundType"></el-table-column>
                <el-table-column label="成立时间" prop="establishTime" sortable="custom"></el-table-column>
                <el-table-column label="存续期" prop="duration" sortable="custom" show-overflow-tooltip></el-table-column>
                <el-table-column label="基金规模</br>(万元)" prop="fundScale" :render-header="renderTitle" sortable="custom">
                    <template slot-scope="scope">
                        {{scope.row.fundScale | format1}}
                    </template>
                </el-table-column>
                <el-table-column label="已投金额</br>(万元)" prop="investmentMoney" :render-header="renderTitle" sortable="custom">
                    <template slot-scope="scope">
                        {{scope.row.investmentMoney | format1}}
                    </template>
                </el-table-column>
                <el-table-column label="已投基金(支)" prop="investmentCast" sortable="custom"></el-table-column>
            </el-table>
        </div>
        <div class="ca-m-t-20 ca-align-center">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="param.pageIndex"
                :page-sizes="vuePageSizes"
                :page-size="vuePageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="totalCount">
            </el-pagination>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
    import {api} from './api';
    import {STATUS_HTTP_SUCCESS, apiHttp} from '__service/csHttp';
    import { isNoAuth } from '__service/utils';
    export default {
        name: 'quit-FOF-list',
        data() {
            return {
                initView: {
                    fundType: [{id: '', name: '全部'}, ...this.$store.state.user.dictionaryMap.fundType],// 基金类型
                },
                fundData: [],
                fundNameKey: '',
                param: {
                    fundType: '', // 基金类型
                    fundName: '', // 基金名称
                    startTime: '', // 成立时间
                    endTime: '',   // 结束时间
                    startScale: '',// 基金规模 - 开始
                    endScale: '',  // 基金规模 - 结束
                    fundState: 5, // 基金状态  4.投资中母基金  5.已退出母基金
                    orderBy: '',   // 排序字段
                    sort: '',      // desc 降序   asc 正序
                    pageSize: null,
                    pageIndex: 1,
                },
                rules: {
                    startScale: [
                        { validator: this.validateMoneyNumber, trigger: 'blur' }
                    ],
                    endScale: [
                        { validator: this.validateMoneyNumber, trigger: 'blur' }
                    ],
                },
                size: null,
                totalCount: null,
                totalPage: null,
                isAuthListDownload: isNoAuth('已退出母基金-列表页-下载'),
                isAuthListSee: isNoAuth('已退出母基金-列表页-查看'),
                isAuthDetailSee: isNoAuth('投资中母基金-母基金详情-查看'),
                isAuthPartnerSee: isNoAuth('投资中母基金-合伙人认缴-查看'),
                isAuthInvestmentSee: isNoAuth('投资中母基金-投资数据-查看'),
                isAuthAnalysisSee: isNoAuth('投资中母基金-统计分析-查看'),
                isAuthPaybackSee: isNoAuth('投资中母基金-子基金回款-查看'),
                isAuthDistributionSee: isNoAuth('投资中母基金-基金分配-查看'),
                isAuthFileSee: isNoAuth('投资中母基金-文档-查看'),
            };
        },
        beforeRouteEnter(to, from, next) {
            next( vm => {
                if (!vm.isAuthListSee) {
                    vm.$message({
                        message: '没有此页面的操作权限',
                        type: 'error',
                        center: true
                    });
                    vm.$router.replace({name: 'personal-center', params: {tabIndex: '0', openWindow: false}})
                }
            })
        },
        mounted() {
            this.getFundsList();
        },
        methods: {
            // 获取母基金列表
            async getFundsList() {
                this.fundNameKey = this.param.fundName;
                if (this.param.startTime) {
                    this.param.startTime = this.$moment(this.param.startTime).format('YYYY-MM-DD');
                }
                if (this.param.endTime) {
                    this.param.endTime = this.$moment(this.param.endTime).format('YYYY-MM-DD');
                }
                let {resCode, data} = await apiHttp(api.GET_FUNDS_LIST, this.param);
                if (resCode === STATUS_HTTP_SUCCESS) {
                    this.fundData = data.resultData;
                    this.size = data.size;
                    this.totalPage = data.totalPage;
                    this.totalCount = data.totalCount;
                }
            },
            // 排序
            sortChange(val) {
                if (val.prop) {
                    this.param.orderBy = val.prop;
                    this.param.sort = val.order === 'ascending' ? 'asc' : 'desc';
                } else {
                    this.param.orderBy = '';
                    this.param.sort = '';
                }
                this.getFundsList();
            },
            toDetail(id) {
                this.$router.push({name: 'invested-FOF', params: {itemId: id, tabIndex: '0', openWindow: true}})
            },
            handleSizeChange(val) {
                this.param.pageSize = val;
                this.getFundsList();
            },
            handleCurrentChange(val) {
                this.param.pageIndex = val;
                this.getFundsList();
            },
            // 下载文件
            downloadFile() {
                if (this.fundData.length === 0) {
                    this.$message({
                        type: 'warning',
                        message: '暂无数据'
                    })
                } else {
                    window.open(this.baseURL + api.DOWNLOAD_FILE.url
                        + '?X-Token=' + this.$store.state.user.token
                        + '&type=9&name=' + this.fundNameKey
                        + '&fundType=' + this.param.fundType
                        + '&fundState=' + this.param.fundState
                        + '&startTime=' + this.param.startTime
                        + '&endTime=' + this.param.endTime
                        + '&startScale=' + this.param.startScale
                        + '&endScale=' + this.param.endScale);
                }
            },
        },
        components: {
            'csRedDot': require('__components/red-dot'), // 选项卡小红点
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .ca-align-center-self {
        display: inline-block;
        width: 100%;
        text-align: center;
        line-height: 44px;
    }
    .ca-w-45 {
        width: 46%;
    }
    .ca-w-90 {
        width: 90%;
    }
    .ca-w-100 {
        width: 100%;
    }
    .ca-list-title {
        margin: 15px 0;
        padding: 20px 20px 0 20px;
    }
</style>
